<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="timer">

		</div>
		<div id="timer2">

		</div>
	</body>
	<script type="text/javascript">
		(function(w, doc, undefined) {
			w.jishi = function(opt) {
				//获取初始化传入的参数
				this.div = doc.querySelector(opt.id);
//				this.num = opt.num;
				this.init(opt.num);
				//初始化方法
			}
			jishi.prototype = {
				constructor: jishi,
				init: function(num) {
					var $this = this;
					var tempdiv = doc.createElement("div");
					var span = doc.createElement("span");
					span.innerHTML = num;
					tempdiv.appendChild(span);
					var spanafter = doc.createElement("span");
					spanafter.innerHTML = "秒";
					tempdiv.appendChild(spanafter);
					$this.div.appendChild(tempdiv);
					$this.timer = setInterval(function() {
						$this.plus();
					}, 1000);
				},
				plus: function() {
					var $this = this;
					var span = $this.div.getElementsByTagName("span")[0];
					var num = span.innerText;
					num--;
					if(num == 0) {
						clearInterval($this.timer);
					};
					num = num < 10 ? "0" + num : num;
					span.innerText = num;
				}
			}
		}(window, document))
	</script>
	<script type="text/javascript">
		var timer = new jishi({
			id: "#timer",
			num: 12
		})
		var timer2 = new jishi({
			id: "#timer2",
			num: 60
		})
	</script>

</html>